const webpack = require('webpack');
const { ModuleFederationPlugin } = require('webpack').container;
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
// const depsPkg = require('./package.json');

const exposeConfig = require('./exposes/config.json');

/** 随机字符串 */
const randomString = (n = 2) => {
  const CHAR_LIST = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'.split('');
  let res = '';
  for (let i = 0; i < n; i++) {
    res += CHAR_LIST[Math.floor(Math.random() * CHAR_LIST.length)];
  }
  return res;
};
module.exports = {
  publicPath: '/extensions/portal/' + exposeConfig.exposes[Object.keys(exposeConfig.exposes)[0]].name,
  productionSourceMap: false,
  configureWebpack: (config) => {
    config.output.uniqueName = randomString(6);
    if (process.env.NODE_ENV === 'production') {
      // 因为vue组件需要使用同一个vue实例，二开组件中的vue不能单独引用
      // config.externals = {
      //   vue: 'Vue',
      // };
      // 只需打包组件，重设entry
      config.entry = './entry-exposes.ts';
      config.plugins.push(new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /zh-cn/));
      // config.plugins.push(new BundleAnalyzerPlugin());

      const getShared = () => {
        const res = {};
        const sharedList =  [
          '@h3/antd-vue',
          '@cloudpivot-shared/ui-designer',
          '@cloudpivot-shared/lightning-ui',
          '@cloudpivot-shared/ui-property-editor',
          '@cloudpivot-shared/engine',
          '@cloudpivot-shared/schema'
        ]
        sharedList.forEach(key => {
          res[key] = {
            // import: false,
            // packageName: key,
            shareScope: 'default',
            shareKey: key,
            singleton: true
          }
        })
        return res;
      }

      config.plugins.push(
        new ModuleFederationPlugin({
          name: exposeConfig.name,
          filename: 'remoteEntry.js',
          library: { type: 'var', name: exposeConfig.name },
          exposes: exposeConfig.exposes,
          shared: getShared()
        }),
      );
    }
  },
  css: {
    extract:
      process.env.NODE_ENV === 'production'
        ? {
            ignoreOrder: true,
          }
        : false,
    loaderOptions: {
      less: {
        modifyVars:{
          "h3-border-radius-xl": '8px',
          'h3-border-radius-lg': '6px',
          'h3-border-radius-base': '4px',
          'h3-border-radius-sm': '2px',
          // -------- 间距 -----------
          'h3-padding-xl': '32px', // containers
          'h3-padding-lg': '24px', // containers
          'h3-padding-md': '16px', // small containers and buttons
          'h3-padding-sm': '12px', // Form controls and items
          'h3-padding-xs': '8px', // small items
          // vertical margin
          'h3-margin-xl': '32px', // containers
          'h3-margin-lg': '24px', // containers
          'h3-margin-md': '16px', // small containers and buttons
          'h3-margin-sm': '12px', // Form controls and items
          'h3-margin-xs': '8px', // small items
          // -------- 阴影 -----------
          'h3-shadow-normal': '0px 2px 12px 0px rgba(52, 94, 184, 0.15)',
          'h3-shadow-large': '0px 4px 18px 0px rgba(51, 93, 182, 0.2)',
          'h3-shadow-card': '0px 0px 8px 0px #D5E8FF',
          'primary-color': '#2970FF',
          'text-color': '#111218',

          'border-radius-sm': '2px',
          'heading-color': '#111218',
          'disabled-color': 'rgba(17, 18, 24, 0.25);',
        },
        javascriptEnabled: true,
      },
    },
  },
};